<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<title></title>
	<style type="text/css">
		 div{
		 	width: 200px;
		 	height: 200px;
		 	background: aqua;
		 	float: left;
		 	margin: 20px;
		 }
		 div:nth-of-type(1){
		 	border-radius: 30px;
		 }
		 div:nth-of-type(2){
			/*	左上和右下 0；右上和左下 50%	 	*/
		 	border-radius: 0 50%;
		 }
		 div:nth-of-type(3){
			/*	顺时针：左上，右上，右下，左下	 	*/
		 	border-radius: 0 20px 50px 50%;
		 }
		 div:nth-of-type(4){
		 	border-radius: 50%;
		 }
		 div:nth-of-type(5){
			/*	椭圆 宽高不一样	 	*/
		 	width: 400px;
		 	border-radius: 50%;
		 }
		 div:nth-of-type(6){
		 	width: 0;
		 	height: 0;
		 	background: white;
		 	border: 50px solid;
		 	border-color: red transparent red red;
		 	border-radius: 50%;
		 }
	</style>
</head>
<body>
	 <div>1</div>
	 <div>2</div>
	 <div>3</div>
	 <div>4</div>
	 <div>5</div>
	 <div>6</div>
</body>
</html>